<script setup lang="ts">
import { useDicomDataStore } from "@renderer/store/pinia/dicomData";
import { computed, inject } from "vue";
import { useTabManagerStore } from "@renderer/store/pinia/tabManager";
import { EnumViewMode, EnumViewType } from "@renderer/assets/types";
import { idHelper } from "@renderer/store/pinia/helper";
const dicomStore = useDicomDataStore();
const tabStore = useTabManagerStore();
const { folderLoadingVisible } = inject("seriesListOp") as any;
const handleDbClick = (patientUID, seriesId) => {
  const newTabId = idHelper.generateNewTabId({
    patientUID,
    seriesId,
    tabType: EnumViewMode.quick,
    viewMode: EnumViewMode.quick,
    viewType: EnumViewType.stack,
  });
  tabStore.appendNewTabRecord(newTabId);
};

const showSearchRef = computed(() => {
  return Object.keys(dicomStore.patientRecord).length > 0;
});

const showMenu = (patientUID, seriesId) => {
  (window as any).menuApi.showContextMenu("", {
    patientUID,
    seriesId,
  });
};

(window as any).menuApi.onMenuAction((msg : {type: ContentMenuType}) => {
  const { type, data }= msg;
  if (type === EnumViewMode.quick) {
    const newTabId = idHelper.generateNewTabId({
      patientUID: data.patientUID,
      seriesId: data.seriesId,
      viewType: EnumViewType.stack,
      viewMode: type,
      tabType: type,
    });
    tabStore.appendNewTabRecord(newTabId);
  } else if (type === EnumViewMode.normal) {
    const seriesUID = dicomStore.getSeriesUID(data.patientUID, data.seriesId);
    dicomStore.appendSelectedSeriesUIDArr(seriesUID);
    tabStore.selectViewType(EnumViewMode.normal, EnumViewType.mpr);
  } else if (type === "openFolder") {
    const seriesRecord = dicomStore.seriesRecord[data.seriesId];
    const folderPath = seriesRecord.folderPath;
    (window as any).folderApi.openFolder(folderPath);
  } else if (type === "removeSeries") {
    const seriesId = data.seriesId;
    dicomStore.removeSeries(seriesId);
  } else if (type === "saveAs") {

  } else if (type === "showTag") {
    const newViewId = idHelper.generateNewTabId({
      tabType: "tag",
      patientUID: data.patientUID,
      seriesId: data.seriesId,
    });
    tabStore.appendNewTabRecord(newViewId);
  }
});
</script>

<template>
  <v-card class="!pt-0">
    <v-list
      v-show="showSearchRef"
      open-strategy="multiple"
      v-model:opened="dicomStore.openedPatientUID"
      v-model:selected="dicomStore.selectedSeriesUIDArr"
    >
      <v-list-group
        v-for="(patientSeriesInfo, patientUID) in dicomStore.patientRecord"
        :key="patientUID"
        :title="patientSeriesInfo.patientName"
        :value="patientSeriesInfo.patientName"
      >
        <template v-slot:activator="{ props }">
          <v-list-item
            v-bind="props"
            :value="patientSeriesInfo.patientName"
          ></v-list-item>
        </template>

        <v-list-item
          v-for="seriesId in patientSeriesInfo.seriesIds"
          :key="seriesId"
          class="!pl-[20px]"
          :value="dicomStore.getSeriesUID(patientUID, seriesId)"
          @dblclick="handleDbClick(patientUID, seriesId)"
          active-class="bg-active"
          @contextmenu="showMenu(patientUID, seriesId)"
        >
          <template v-slot:prepend="{ isSelected, select }">
            <v-checkbox-btn
              :model-value="isSelected"
              @update:model-value="select"
            ></v-checkbox-btn>
          </template>

          <div class="d-flex align-center w-100">
            <div class="d-flex justify-space-between w-100 px-3">
              <div class="select-none">
                {{ dicomStore.seriesRecord[seriesId]?.desc }}
              </div>
              <div class="select-none">
                #{{ dicomStore.seriesRecord[seriesId]?.count }}
              </div>
            </div>
          </div>
        </v-list-item>
      </v-list-group>
    </v-list>

    <v-progress-linear
      :active="folderLoadingVisible"
      color="active"
      height="6"
      indeterminate
      rounded
    ></v-progress-linear>
  </v-card>
</template>

<style scoped></style>
